<div class="palette-box">
    <div class="palette">
        <div class="p-header">
          <ul>
            <li  *ngFor="let item of sizes">
              <div  [ngClass]="['size-item', item.name]"
                    [ngStyle]="{'font-size': item.size+'px'}" 
                    (click)="onSelectSize(item)"
                    [class.selected]="item === selectedSize"
              > </div>
            </li>
          </ul>
        </div>
        <div class="p-gird">
          <ul>
            <li *ngFor="let color of colors">
              <div class="color-item"
              [ngStyle]="{'background-color': color.color}" 
              (click)="onSelectColor(color)"
              [class.selected]="color === selectedColor"
              >
              </div>
            </li>
          </ul>
        </div>
      </div>
</div>
